<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/vue.js"></script>
    <script src="../js/axios.min.js"></script>
</head>
<body>
    <div id="app" style="text-align: center;">
        <h3>我是一个注册页面</h3>
        <form >
            用户名:<input type="text" v-model="user.username"><br/>
            密码:<input type="password" v-model="user.password"><br/>
            年龄:<input type="text" v-model="user.age"><br/>
            邮箱:<input type="text" v-model="user.email" ><br/>
            <input type="button" value="点我注册" @click="register()">
        </form>
    </div>
<script>
    new Vue({
        el:"#app",
        data:{
            user:{}
        },
        methods:{
            register(){
                //提交数据 到服务器端
                console.log(this.user);


                //提交数据
                //使用axios 直接给出一个对象
                //那么axios 就会把这个对象转换json格式 放在请求体中 提交给服务器端
                axios.post("/user/register",this.user)
                    .then((response)=>{
                        alert("注册成功");
                    })




            }

        }







    });


</script>
</body>
</html>